<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

<style>
/*基础样式*/
body,h1,h2,h3,p,dl,dd,ol,ul,th,td,fieldset,input,button,textarea,form,canvas,audio,video,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,div,form,input,search{margin:0;padding:0;font-family:"微软雅黑","宋体","microsoft yahei", Arial, Helvetica;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{display:block;}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;word-wrap:break-word}
h1,h2,h3{font-size:100%}
body { -webkit-text-size-adjust: none;margin:0;padding:0;}
ol,ul{list-style:none}
table{border-collapse:collapse;border-spacing:0;empty-cells:show;font-size:inherit}
img{border:0;-ms-interpolation-mode:bicubic}
cite,em,s,i,b{font-style:normal}
input,button,textarea,select{font-size:100%; border:0;}
body,input,button,textarea,select,option{font-size:normal}
a,input,textarea{text-decoration:none;outline:0;-webkit-tap-highlight-color:rgba(0,0,0,0); color:#666;}
li,img,label,input{vertical-align:middle}
var{font-style:normal}
ins{text-decoration:none}
abbr,acronym{border:0;font-variant:normal}
body{font: 14px/18px "微软雅黑",Arial,"宋体";color: #333;margin: 0;padding: 0;background: #fff;}
a:hover{color:#198fd3;}

/*------------------定位--------------------------*/
.dis-in{display: inline-block;}
.fl,.fr{display:inline}.fl{float:left}.fr{float:right}                                                    
.cb{clear:both}
.clearfix:after{content:" ";display:block;height:0;clear:both;visibility:hidden;font-size:0;}
.clearfix{zoom:1}
.tc{ text-align:center;}
.tl{ text-align:left;}
.tr{ text-align:right;}
.pr{ position:relative;}
.pa{ position:absolute;}

/*------------------宽度--------------------------*/
.w1200{ width:1200px; margin:0 auto;}
.w980{ width:980px;}
.w248{ width:248px;}
.w835{ width:835px;}
.w310{ width:310px;}

/*------------------边距--------------------------*/
.pb30{ padding-bottom:30px}
.pt30{ padding-top:30px;}
.p10{ padding:10px;}
.p20{padding: 20px;}
.p30{padding: 30px;}
.p30-0{padding: 30px 0px;}
.pt10{ padding-top:10px;}
.m20{margin: 20px auto;}
.ml5{ margin-left:5px;}
.ml10{ margin-left:10px;}
.ml20{ margin-left:20px;}
.mt10{ margin-top:10px;}
.mt30{ margin-top:30px;}
.mt40{ margin-top:30px;}
.pl10{ padding-left:10px;}
.mt40{ margin-top:40px;}
.mt50{ margin-top:50px;}
.mt20{ margin-top:20px;}
.mb30{ margin-bottom:30px;}
.mr5{ margin-right:5px}
.pr20{ padding-right:20px;}

/*------------------背景颜色----------------------*/
.bg-green{background-color: #82d151;}
.bg-purple{background-color: #9857f3;}
.bg-yellow{background-color: #ebc256;}

/*------------------字体属性-颜色----------------------*/
.font-white{color: #fff;}
.font-orange{color: #fc9732;}
.font-red{color: #f71d27;}
.font-green{color: #82d151;}
/*------------------字体属性-加粗----------------------*/
.font-weight{font-weight: bold;}
/*------------------字体属性-对齐----------------------*/
.t-l{text-align: left;}
.t-r{text-align: right;}
/*------------------字体属性-大小----------------------*/
.f-20{font-size: 20px;}



[data-role="transition"] {
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

[data-role="transition"] { 
	-moz-transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	transition:all 0.5s ease;
}

/*------------------输入框placeholder颜色----------------------*/
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	 /* WebKit browsers */
	color: #333333;
	text-indent: 4px;
	font-size: 12px;
 }
input:-moz-placeholder, textarea:-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	color: #333333;
	text-indent: 4px;
	font-size: 12px;
}
input::-moz-placeholder, textarea::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	color: #333333;
	text-indent: 4px;
	font-size: 12px;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
	/* Internet Explorer 10+ */
	color: #333333;
	text-indent: 4px;
	font-size: 12px;
}

/*------------------清除超出内容----------------------*/
.ellipse {overflow: hidden;  text-overflow:ellipsis; white-space: nowrap;  }
.ellipsis{overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
</style>
